<template>
  <div class="settingList">
    <div class="main">
      <div class="main_top">
        <el-button size="small" type="primary" @click="addActivity"
          >新增活动</el-button
        >
      </div>
      <ex-table
        ref="table"
        :loading="loading"
        :table-column="tableColumn"
        :table-data="tableData"
        @pageSizeChange="handleSizeChange"
        @currentPageChange="handleCurrentChange"
      >
        <template v-slot:status="{ scope }">
          <dict-tag :options="statusList" :value="scope.row.status" />
        </template>
        <template v-slot:operate="{ scope }">
          <el-button @click="handleEdit(scope.row.id)" size="mini" type="primary" v-if="scope.row.status == 1 || scope.row.status == 2">编辑</el-button>
          <el-button @click="handleLook(scope.row.id)" size="mini" type="primary" >查看</el-button>
          <el-button @click="handleActivity(scope.row)" size="mini" type="primary" >活动详情</el-button>
        </template>
      </ex-table>
    </div>
  </div>
</template>
<script>
import {
  inviteList,
  adminDict
} from '@/api/inviteNew'

// mixins
import handlePageMixin from "@/mixins/handlePageMixin";

export default {
  name: "",
  components: {
   
  },
  mixins: [handlePageMixin],
  data() {
    
    return {
      loading: false,
      detailDialog: false,
      numShow: false,
      statusList: [],
      tableData: [
        {}
      ],
      id: '',
      tableColumn: [
        { prop: "name", label: "活动名称" },
        { prop: "startTime", label: "开始时间"},
        { prop: "endTime", label: "结束时间" },
        { prop: "participateCount", label: "参与人数"},
        { prop: "inviteCount", label: "邀请人数" },
        { label: "活动状态", slot: true, slotName: "status"},
        { label: "操作", slot: true, slotName: "operate",width: '240' },
      ],
      filter: {
       
      },
    };
  },
  created() {
    this.getadminDict()
    this.getList();
  },
  mounted() {},
  methods: {
    getadminDict() {
        //获取商户类型字典
        const params = {
          dictType: "invite_activity_status",
        };
        adminDict(params).then((res) => {
          this.statusList = res.result[0].dictList;
        });
      },
    //列表
    getList() {
      this.loading = true;
      const params = {
        ...this.pageOptions,
      };
      inviteList(params)
        .then((res) => {
          const { total, records } = res.result;
          console.log("账号列表", records);
          this.$refs.table.pageOptions.total = total;
          this.tableData = records;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    selectQueryType(value) {
      if (!value) {
        this.filter.userName = "";
      }
    },
    //新建活动
    addActivity() {
      this.$router.push({
        path: '/inviteNew/add-inviteNew',
        query: {
          pathType: 'add',
        },
      })
    },
    //添加数量
    addNumber(row){
      this.numShow = true
    },
    //
    _handleSuccess(data) {
      console.log("data", data);
      this.pageOptions.pageNum = 1
      this.$refs.table.pageOptions.pageNum = 1
      this.getList();
    },
    
    //编辑
    handleEdit(id){
      this.$router.push({
        path: '/inviteNew/add-inviteNew',
        query: {
          pathType: 'edit',
          id: id
        },
      })
    },
    //查看
    handleLook(id){
      this.$router.push({
        path: '/inviteNew/add-inviteNew',
        query: {
          pathType: 'detail',
          id: id
        },
      })
    },
    //查看活动详情
    handleActivity(row){
      this.$router.push({
        path: '/inviteNew/inviteNew-detail',
        query: {
          id: row.id,
          name: row.name
        },
      })
    },
  },
};
</script>
<style lang="scss" scoped>
.settingList{
    padding: 20px;
}
.top{
    display: flex;
    padding: 10px;
    background: #fff;
    border-radius: 4px;
    .pad{
        padding-right: 24px;
    }
    .time{
      
        .label{
            font-size: 14px;
            color: #606266;
        }
    }
}
.main{
    margin-top: 10px;
    padding: 10px;
    background: #fff;
    .main_top{
        padding: 10px 0;
    }
}
</style>